<script setup lang="ts">
import _ from "lodash";
import {Empty} from 'ant-design-vue';
import {PagePath} from "@/util/commonUtil";

defineProps({
  postList: {
    type: Array<any>,
    required: true
  }
})

const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE;

function goToPost(item:any){
  if (item.type == '0'){
    window.open(PagePath.PostInfoPath + item.oid, '_blank')
  }else {
    window.open(item.outsideLink, '_blank')
  }
}
</script>

<template>
  <div class="sortRight">
    <a-empty :image="simpleImage" v-if="postList.length == 0"/>
    <a-timeline v-else>
      <template v-for="item in postList" :key="item.uid">
        <a-timeline-item @click="goToPost(item)">
          <time class="text-gray-400">{{ item.createTime }}</time>
          <a-row class="mt-2 cursor-pointer p-4 rounded" style="border: thin solid rgb(203 213 225)">
            <a-col :span="18">
              <h3>{{ item.title }}</h3>
              <div class="mt-2">
                <a-tag v-if="item.isOriginal == 1" color="pink">原创</a-tag>
                <a-tag v-if="item.isOriginal == 0" color="cyan">转载</a-tag>
                <a-tag v-if="item.author" color="orange">{{ item.author }}</a-tag>
                <a-tag v-if="!_.isNull(item.blogSort)" color="purple">{{ item.blogSort.sortName }}</a-tag>
                <template v-for="tagItem in item.tagList" :key="tagItem.uid">
                  <a-tag color="blue">{{ tagItem.content }}</a-tag>
                </template>
              </div>
              <div class="mt-2">
                <span class="line-clamp-1 text-gray-400">{{ item.summary }}</span>
              </div>
            </a-col>
            <a-col :span="5">
              <img :src="item.photoUrl" :alt="item.title" v-lazy="item.photoUrl" class="rounded">
            </a-col>
          </a-row>
        </a-timeline-item>
      </template>
    </a-timeline>
  </div>
</template>

<style scoped lang="less">

</style>
